<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小滴课堂</title>
    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./reset.css">
    <link rel="stylesheet" href="xdclass1.css">
    <script src="http://at.alicdn.com/t/c/font_4861064_0qfklgc9wnca.js"></script>

</head>

<body>
    <div class="xdclass_home">
        <div class="header_img">
            <img src="hdd.jpg" alt="">
        </div>
        <div class="header_nav">
            <div class="nav_left">
                <img src="https://front.cdn.xdclass.net/images/logo.webp"  class="logo">
                <div>首页</div>
                <div>课程中心</div>
                <div>超级会员
                    <i>hot</i>
                </div>
                <div>学习路线
                    <i>hot</i>
                </div>
                <div>一对一辅导
                    <i>hot</i>
                </div>
                <div>工具</div>
                <div>回答论坛</div>
                <input type="text">
                <svg class="sousuo" aria-hidden="true">
                    <use xlink:href="#icon-sousuo"></use>
                </svg>
            </div>
            <div class="nav_right">
                <div>课程骨折
                    <i>hot</i>
                </div>
                <div>云服务器
                    <i>hot</i>
                </div>
                <div>课程兑换码</div>
                <div>
                    <svg class="vip" aria-hidden="true">
                        <use xlink:href="#icon-VIP"></use>
                    </svg>
                </div>
                <div>我的学习</div>
                <div>
                    <img src="https://img.alicdn.com/imgextra/i4/O1CN01aG16y424E11XsURUd_!!6000000007358-2-tps-206-240.png" alt="" class="right_img">
                </div>
            </div>
        </div>
        <div class="banner">
            <div class="banner_left">
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
                <div class="left_item">
                    后端&架构 
                    <svg class="xiangyou" aria-hidden="true">
                        <use xlink:href="#icon-xiangyou1"></use>
                    </svg>
                </div>
            </div>
            <div class="banner_right">
                <img src="https://file.xdclass.net/video/2025/banner/3/ALI.png" alt="">
            </div>
        </div>
    </div>
</body>
</html>